<template>
	<h1>首页</h1>
	<h2>{{ counter }}</h2>
	<div class="home">
		<div class="row">
			<button @click="setHeader">设置uni标题</button>
		</div>
		<div class="row">
			<button @click="login">登录</button>
		</div>
		<div class="row">
			<button @click="logout">退出登录</button>
		</div>
		<div class="row">
			<button @click="toLogin">去登录页</button>
		</div>
	</div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue'
import webviewJavascriptBridge from '@/utils/hybrid'

export default defineComponent({
	setup() {
		const counter = ref(0)
		
		const increment = (n = 1) => {
			counter.value += n
		}
		const setHeader = () => {
			webviewJavascriptBridge.setHeader({
				title: '哈哈' + counter.value++
			})
		}
		const login = () => {
			webviewJavascriptBridge.login({
				username: 'li',
				password: '123'
			}, data => {
				console.log(data)
			})
		}
		
		const logout = () => {
			webviewJavascriptBridge.logout({
				username: 'li',
				password: '123'
			}, data => {
				console.log(data)
			})
		}
		
		const toLogin = () => {
			webviewJavascriptBridge.uni.navigateTo({
				url: '/pages/login/login'
			})
		}
		
		return {
			setHeader,
			increment,
			counter,
			login,
			logout,
			toLogin
		}
	}
})
</script>
